<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/static/css/login_style.css">
    <script src="/static/js/login_script.js"></script>
</head>
<body>
    <form action="/login/" method="post">   
        
        
        <div class="j1" id="j1">
    <div class="div1_1">
      <p class="p1"><b>欢迎登录</b></p>
       <!-- 手机号输入 -->
      <div class="input-group">
        <label class="la" for="phone">手机号：</label>
        <input class="in" type="text" id="phone" name="phone" maxlength="11" required>
      </div>
      <!-- 账号输入 -->
      <div class="input-group">
        <label class="la" for="username">账号：</label>
        <input class="in" type="text" id="username" name="username" required>
      </div>
      <!-- 密码输入 -->
      <div class="input-group pwd-group">
        <label class="la" for="password">密码:</label>
        <input class="in" type="password" id="password" name="password" required>
        <span class="eye" id="togglePwd">👁️</span>
      </div>
      <!-- 验证码输入 -->
      <div class="input-group">
        <label class="la" for="code">验证码：</label>
        <input class="in" type="text" id="code" name="code" maxlength="6" style="width:90px;">
        <button type="button" class="get-code-btn" id="getCodeBtn">获取验证码</button>
      </div>
      <!-- 只保留忘记密码 -->
      <div class="remember-forgot">
        <a href="forget.html" target="_blank">忘记密码？</a>
      </div>
        
        <div class="btn-group">
        <input type="submit" value="登录">
        <font color="red">{{ msg }}</font>
        
      </div>
      {% for message in messages %}
        {%  if message %}
        <p style="text-align: center;color: red">{{ message }}</p>
        {% endif %}
    {% endfor %}
      
    </div>
  </div>
    </form>
</body>
</html>